<template>
	<view class="content">
		<view style="height: 187rpx;"></view>
		<view class="textCen fowe800" style="font-size: 60rpx;color: #C38D5F;">登录</view>
		<view class="wid80 mar vie">
			<view class="wid90 mar foSi35 fowe600" style="color: #C38D5F;">手机号：</view>
			<view class="wid90 mar bacFFF mar-top20" style="height: 95rpx;">
				<input class="wid90 mar hei100 foSi25" style="color: #C38D5F;" v-model="phone" placeholder="请输入手机号" />
			</view>
			<view class="wid90 mar foSi35 mar-top30 fowe600" style="color: #C38D5F;">验证码：</view>
			<view class="wid90 mar dis disAl bacFFF mar-top20" style="height: 95rpx;">
				<view style="width: 5%;"></view>
				<input class="foSi25" maxlength="4" style="height: 95rpx;width: 65%;color: #C38D5F;" v-model="code"
					placeholder="请输入请输入验证码" />
				<view style="width: 30%">
					<view @click="getcode()" class="yz mar dis disAl disJuC foSi20 borRad10">{{yanzheng}}</view>
				</view>
			</view>
		</view>
		<view class="denglu mar hei80 dis disAl disJuC coFFF foSi30 borRad40" @click="tiaozhuan">注册/登录</view>
		<!-- #ifdef MP-WEIXIN -->
            <button @getphonenumber="getWechatMobile" open-type="getPhoneNumber" class="wx mar hei80 dis disAl disJuC coFFF foSi30 borRad40 mar-top30">一键登录</button>
		<!-- #endif -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				count: '', // 倒计时
				clickFalg: 0, //  点击次数
				yanzheng: '发送验证码',
				phone: '',
				code: ''
			}
		},
		onLoad() {},
		methods: {
			getcode() {
				var that = this
				// 获取验证码
				console.log(that.clickFalg)
				if (that.clickFalg !== 0) {
					return
				}
				//   var reg = 11 && /^((13|14|15|17|18)[0-9]{1}\d{8})$/
				let reg = /^[0-9]{11}$/ // 手机号码验证
				if (!reg.test(that.phone)) {
					uni.showToast({
						title: '请输入正确手机号',
						icon: 'error',
						duration: 2000
					})
				} else {
					that.clickFalg = 1
					const TIME_COUNT = 60
					if (!that.timer) {
						that.count = TIME_COUNT
						that.codeshow = false
						that.timer = setInterval(() => {
							if (that.count > 0 && that.count <= TIME_COUNT) {
								that.count--
								that.yanzheng = that.count + '秒'
							} else {
								that.codeshow = true
								that.yanzheng = '重新获取'
								clearInterval(that.timer)
								that.timer = null
								that.clickFalg = 0
							}
						}, 1000)
					}
					that.huoCode()
				}
			},
			huoCode(){
				var that = this
				uni.request({
					url: that.global.url+'/api/Sms/send',
					method: 'POST',
					header: {},
					data: {
						mobile: that.phone
					},
					success: (res) => {
						let result = res.data
						if (result.code == 1) {
							const TIME_COUNT = 60
							if (!that.timer) {
								that.count = TIME_COUNT
								that.timer = setInterval(() => {
									if (that.count > 0 && that.count <= TIME_COUNT) {
										that.count--
										that.yanzheng = that.count + '秒'
									} else {
										that.yanzheng = '重新获取'
										clearInterval(that.timer)
										that.timer = null
										that.clickFalg = 0
									}
								}, 1000)
							}
						} else {
							uni.showToast({
								title: result.msg,
								icon: 'error',
								duration: 2000
							})
						}
					},
					complete() {
						uni.hideLoading()
					}
				});
			},
			tiaozhuan() {
				var that = this;
				// #ifdef MP-WEIXIN
				var type = 'mini'  //微信小程序
				// #endif
				// #ifdef H5
				var type = 'wechat' //公众号
				//#endif
				uni.request({
					url: that.global.url+'/api/User/mobilelogin',
					method: 'POST',
					header: {},
					data: {
						mobile: that.phone,
						captcha: that.code,
						type:type,
						openid: uni.getStorageSync('openid'), 
					},
					success:(res)=>{
						console.log(res);
						var apiResult = res.data;
						uni.showToast({
							title: apiResult.msg,
							icon: 'none',
							duration: 1000
						});
						if(apiResult.code == 1){
							uni.setStorageSync('userinfo', apiResult.data.user);
							uni.setStorageSync('token', apiResult.data.user.token);
							setTimeout(function () {
								uni.switchTab({
									url: '/pages/wode/wode'
								});
							}, 1000);
						}
					}
				})
				// uni.reLaunch({
				// 	url: '/pages/index/index'
				// })
			},
			getWechatMobile(e) {
				var _zz_that = this;
				// #ifdef MP-WEIXIN
				var type = 'mini'  //微信小程序
				// #endif
				// #ifdef H5
				var type = 'wechat' //公众号
				//#endif
				if (e.detail.errMsg != 'getPhoneNumber:ok') {
					return false;
				}

				uni.showLoading({
					title: '登录中'
				});

				uni.request({
					url: _zz_that.global.url + '/api/user/_zz_loginByWechat', 
					method: 'POST', 
					header: {
						'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8'
					}, 
					data: {
						code: e.detail.code,
						type: type,
						openid: uni.getStorageSync('openid'), 
						
					}, 
					complete: function () {
						uni.hideLoading();
					}, 
					success: function (result) {
						var apiResult = result.data;
						uni.showToast({
							title: apiResult.msg,
							icon: 'none',
							duration: 1000
						});
						if (apiResult.code == 1) {
							uni.setStorageSync('userinfo', apiResult.data.user);
							uni.setStorageSync('token', apiResult.data.user.token);
							setTimeout(function () {
								uni.switchTab({
									url: '/pages/wode/wode'
								});
							}, 1000);
						}
					}
				});
			},
		}
	}
</script>

<style>
	.content {
		height: 100vh;
		background-color: #F4EDDD;
	}

	.yz {
		width: 120rpx;
		height: 48rpx;
		border: 2px solid #C38D5F;
		color: #C38D5F;
	}

	.denglu {
		background-color: #C38D5F;
		width: 450rpx;
		margin-top: 100rpx;
	}

	.wx {
		background-color: #009B4C;
		width: 450rpx;
	}

	.vie {
		margin-top: 95rpx;
		background-color: #FAF7F0;
		padding: 51rpx 0;
	}
</style>